
    /* base color
-------------------------- */
    $colorWhite                       : #FFF;
    $colorBlack                      : #000;
    $colorYellow                      : #FFDA00;

    //@colorPrimary                     : #AFA37E;
    $colorPrimary                     : #409EFF;
    $colorPrimary-light               : #EAE5D4;
    $colorPrimary-darken              : #978755;

    $colorSuccess                     : #5BBA69;
    $colorWarning                     : #FFB403;
    $colorDanger                      : #FF5757;
    $colorError                      : #FF001F;

    /* layout navigate
    -------------------------- */
   $navBackgroundColor             : #3C3C3C;
    $navBackgroundColorHover        : #585858;

    /* link
    -------------------------- */
    $colorLinkBase                  : #2774FF;

    /* checkbox radio
    -------------------------- */
    $checkboxColor                   : #61A5FF;

    /* text color
    -------------------------- */
    $colorTextBase                   : #000;
    $colorTextSecond                 : #333;
    $colorTextThird                  : #666;
    $colorTextLight                  : #999;
    $colorTextPlaceholder           : #999;
    $colorTextDisabled               : #D8D8D8;
    $colorTextSelected              : #FF8A00;

    /* icon
    -------------------------- */
    $colorIconBase                   : #999;
    $colorIconInfo                   : $colorPrimary;
    $colorIconSuccess                :  $colorSuccess;
    $colorIconError                  : $colorDanger;
    $colorIconWarning                : $colorWarning;

    /* background-color
    -------------------------- */
    $backgroundColorBase             : #F2F2F2;
    $backgroundColorSelected         : #F2F2F2;
    $backgroundColorHover            : #F7F7F7;
    $backgroundColorLight           : #FBFBFB;
    $backgroundColorLighter          : #FAFAFA;

    /* border
    -------------------------- */
    $borderBaseStyle                 : 1px solid #DDD;
    $borderRadius                    : 4px;
    $borderColorBase                 : #DDD;
    $borderColorLight                : #D8D8D8;
    $borderColorLighter              : #EEE;

    /* Font
    -------------------------- */
    $fontSizeBase                    : 14px;
    $fontSizeSmall                   : 12px;
    $fontSizeLarge                  : 14px;
    $fontSizeLarger                 : 16px;
    $fontSizeLargest                 : 18px;
    $fontWeightMedium               : 500;
    $fontFamily                       : OpenSans,Arial,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;
    $fontLineHeight                  : 1;

    /* Animation
    -------------------------- */
    $animationTransitionTime         : 300ms;
    $animationTransitionTiming        : ease-in-out;

    /* Layout
    -------------------------- */
    $layoutSafeWidth                 : 1200px;
    $layoutBetterWidth                : 1440px;

    $mainC: #000;
    $emphasizeC: #FF8A00;
    $warningC: #f30240;
    $normalC: #666;
    $assistC: #999;
    $disableC: #CCC;
    $borderC: #EEE;
    $assistBgC: #F9F9F9;
    $contentWidth: 980px; /*内容区宽度*/
@mixin pct($pct) {
    width: $pct;
    position: relative;
    margin: 0 auto;
}

/* 反馈颜色 */
@mixin actionFb($color) {
    background-color: $color;
    transition: background-color .5s ease;
    &:hover{
        background-color: color(#{$color} alpha(-20%));
    }
}

/* css绘制三角形 */
@mixin triangle($width)  {
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-width: $width;
}

/* 多行文字超过部分显示 "..." */
@mixin multiline($lineHeight, $line)  {
    display: -webkit-box !important;
    height: calc(#{$lineHeight} * #{$line});
    line-height: $lineHeight;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $line;
}

/* 滑过阴影 */
@mixin hoverShadow {
    transition: box-shadow .2s linear;
    &:hover{
        box-shadow: 0 2px 10px #666;
    }
}

/* 单行文本超过部分显示 "..." */
@mixin nowrap {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-wrap: normal;
}


@mixin fontBase{
    font-family: Montserrat, Arial, Helvetica, sans-serif;
}

@mixin fontBold{
    font-weight: bold;
}
